<template>
  <div class="form-layout">
    <!--左侧导航-->
    <div class="nav-left">
      <customAnchor
        :itemList="[{name: 'box-base',title: '基础信息'},
        {name: 'box-contact',title: '联系信息'},
        {name: 'box-map',title: '关联信息'},
        {name: 'box-use',title: '使用状态'}
        ]"
      />
    </div>

    <!--表单区域-->
    <div  class="form-right" ref="formRight">
      <customForm
        :data="form"
        :rules="propRules"
        ref="editForm"
        :disabled="propReadonly"
      >
        <template #content>
          <div id="box-base" class="box-title">基础信息</div>
          <customFormItem
            label="供应商名称"
            name="name"
            :parent="_self"
            :form="form"
            helpBottom="供应商名字不可以重复,没有所属商品并且尚未推送外网才可以修改"
            full-width
            ref="name"
            :disabled="form.flagDisabledSpEdit"
          />
          <customFormItem
            label="社会信用代码"
            name="companyCode"
            :parent="_self"
            :form="form"
            helpBottom="社会信用代码不可以重复"
            full-width
          />
<!--          <customFormItem
            label="所属配送商"
            name="distributorId"
            :parent="_self"
            :form="form"
            :type="constCommon.formItemType.selectStatic.name"
            :config="{key: 'id', label: 'name', value: 'id', options: propDictionaries.distributorId}"
            full-width

          />-->
          <customFormItem
            label="备注"
            name="remark"
            :parent="_self"
            :form="form"
            full-width
            :type="constCommon.formItemType.textarea.name"
          />

          <div id="box-contact" class="box-title">联系信息</div>
          <customFormItem
            label="联络人"
            name="contacts"
            :parent="_self"
            :form="form"
          />
          <customFormItem
            label="联系电话"
            name="telephone"
            :parent="_self"
            :form="form"
          />
          <customFormItem
            label="企业地址"
            name="address"
            :parent="_self"
            :form="form"
            full-width
          />

          <div id="box-map" class="box-title">关联信息</div>
          <customFormItem
            label="外网编码"
            name="mscmCode"
            :parent="_self"
            :form="form"
            disabled
          />
          <customFormItem
            label="HRP编码"
            name="hrpCode"
            :parent="_self"
            :form="form"
            disabled
          />
<!--          <customFormItem
            label="阳采配送商编码"
            name="sunCompanyIdPs"
            :parent="_self"
            :form="form"
          />
          <customFormItem
            label="阳采配送商名字"
            name="sunCompanyNamePs"
            :parent="_self"
            :form="form"
          />-->

          <div id="box-use" class="box-title">使用状态</div>
          <customFormItem label="禁用" name="flagDisabled" :parent="_self" :form="form"  :type="constCommon.formItemType.switch.name"
                          helpBottom="禁用后该供应商不可使用，相关商品不可采购和入库"
          />
        </template>
      </customForm>
    </div>

    <customDrawer
      title="变更供应商名称"
      ref="customDrawerChangeName"
      :widthPx="460"
      :heightPx="291"
      :zIndex="1000"
      @confirm="handleDrawerChangeName"
      :autoHide="false"
    >
      <template #content>
        <customForm :data="changeForm" ref="changeForm" :rules="changeRules"  style="padding: 20px 10px;" :label-width="100">
          <template #content>
            <customFormItem
              label="原始供应商"
              name="nameFrom"
              :parent="_self"
              :form="changeForm"
              full-width
              disabled
            />
            <customFormItem
              label="新供应商"
              name="nameNew"
              :parent="_self"
              :form="changeForm"
              helpBottom="供应商名字不可以重复"
              full-width
              ref="nameNew"
            />
            <customFormItem
              label="复制商品"
              name="flagCopyMatr"
              :parent="_self"
              :form="changeForm"
              :type="constCommon.formItemType.switch.name"
              helpBottom="勾选后，将复制原始供应商的相关商品到新供应商"
            />
          </template>
        </customForm>
      </template>
    </customDrawer>
  </div>
</template>

<script>
import customAnchor from '@/components/custom/form/customAnchor.vue'

export default {
  data() {
    return {
      form: {},
      viewData: {},
      changeForm: {
        flagCopyMatr: true
      },
      changeRules: {
        nameNew: [{ required: true, message: '请输入原始密码', trigger: 'blur' }],
      },
    }
  },
  created() {
    let that = this
    this.$emit('event-register', {
      validate: (callback) => {
        return this.$refs.editForm.validate(callback)
      },
      beforeSave: () => {
        this.$emit('data-callback', this.form)
        return true
      },
      afterMove: (formData, initData) => {
        this.form = global.utils.jsonClone(formData)
        if (!this.form.id) {
          this.$set(this.form, 'flagDisabledSpEdit', false)
        }
      },
      afterSave: () => {
        // 用作返回自动主键
        this.form[this.propPrimaryKey] = this.propViewFormData[this.propPrimaryKey]
      },
      beforeDelete: () => {
        return true
      },
      afterDelete: () => {
      },
      beforeFlow: (flowButtonKey) => {
        return true
      },
      afterFlow: (flowButtonKey) => {
      },
      beforeClose: () => {
        return true
      },
      afterClick(button, data, viewForm) {
        let {key: buttonKey} = button
        if (buttonKey == 'changeName') {
          that.$set(that.changeForm, 'nameFrom', that.form.name)
          that.$set(that.changeForm, 'idFrom', that.form.id)
          that.$set(that.changeForm, 'nameNew', null)
          that.$set(that.changeForm, 'flagCopyMatr', true)
          that.$refs.customDrawerChangeName.show()
          that.$refs.nameNew.focus()
        }
      }
    })
  },
  props: {
    propParent: Object,
    propInitData: Object,
    propPrimaryKey: String,
    propDictionaries: Object,
    propCurrentRow: Object,
    propViewFormData: Object,
    propReadonly: Boolean,
    propStatus: String,
    propRules: Object
  },
  components: {
    customAnchor
  },
  computed: {
  },
  methods: {
    changePy() {
      this.form.namePy = this.pyutils.getAllFirstLetter(this.form.name)
      console.log('input 方法')
    },
    focusFirst() {
      this.$refs.name.focus()
    },
    handleDrawerChangeName() {
      this.$refs.changeForm.validate().then((result) => {
        if (result && result == true) {
          this.utilVue.loadShow(true)
          this.$ajax.post('/base/supplier/changeName', this.changeForm).then(resp => {
            if ( resp.code == 0 ){
              this.utilMessage.success(resp.msg)
              this.$refs.customDrawerChangeName.hide()
            }
            this.utilVue.loadHide()
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .container {
    width: 100%;
    height: 100%;
  }
</style>
